<div style="margin-top: 50px;"></div>
<form class="layui-form form" method="post" action="<?= base_url("word/television/save_button") ?>">

    <input type="hidden" name="id" class="id" value="<?= $row['id'] ?>">

    <div class="layui-form-item"><label class="layui-form-label">标签名称</label>
        <div class="layui-input-block" style="width: 350px;">
            <select name="test_biaoqian" class="test_biaoqian">
                <?php foreach ($select as $k => $v): ?>

                    <?php if ($row['biaoqian'] == $v['id']) : ?>
                        <option selected value="<?= $v['id'] ?>"><?= $v['name'] ?></option>
                    <?php else: ?>
                        <option value="<?= $v['id'] ?>"><?= $v['name'] ?></option>
                    <?php endif; ?>
                <?php endforeach; ?>
            </select>
        </div>
    </div>
    <div class="layui-form-item"><label class="layui-form-label">频道名称</label>
        <div class="layui-input-block" style="width: 350px;">
            <input type="text" name="test_name" placeholder="请输入频道名称" class="layui-input test_name"
                   value="<?= $row['test_name'] ?>">
        </div>
    </div>

    <div class="layui-form-item"><label class="layui-form-label">频道排序</label>
        <div class="layui-input-block" style="width: 350px;">
            <input type="text" name="test_sort" placeholder="请输入频道排序" class="layui-input test_sort"
                   value="<?php if ($row['test_sort'] == 999999999) {
                       echo 0;
                   } else {
                       echo $row['test_sort'];
                   } ?>">
        </div>
    </div>

    <div class="layui-form-item"><label class="layui-form-label"></label>
        <div class="layui-input-inline">
            <button type="button" class="layui-btn" style="margin-left: 15px;" id="edit">保存</button>
        </div>
    </div>
</form>


<hr>

<div>
    <div style="overflow: hidden;">
        <button type="button" class="layui-btn" style="margin-left: 15px; float: right" id="add-sub-type">添加话题</button>
    </div>
    <table class="layui-table" style="">
        <!--        <colgroup>-->
        <!--            <col width="8%">-->
        <!--            <col width="12%">-->
        <!--            <col width="15%">-->
        <!--            <col width="5%">-->
        <!--            <col width="5%">-->
        <!--            <col width="10%">-->
        <!--        </colgroup>-->
        <thead>
        <tr>
            <th>ID</th>
            <th>缩略图</th>
            <th>话题名称</th>
            <th>添加时间</th>
            <th>话题所属分类</th>
            <th>上线状态</th>
            <th>操作</th>
        </tr>
        </thead>

        <tbody>
        <?php foreach ($hasSubType as $k => $v) : ?>
            <tr>
                <td><?= $v['id'] ?></td>
                <td>
                    <img src="<?= $v['sub_pic'] ?>" alt="" style="height: 40px;">
                </td>
                <td><?= $v['sub_title'] ?></td>
                <td><?= $v['add_date'] ?></td>
                <td><?= $v['is_other_name'] ?></td>
                <td>
                    <?php if ($v['online'] == 2): ?>
                        <span class="layui-bg-green">上线</span>
                    <?php else: ?>
                        <span class="layui-bg-orange">下线</span>
                    <?php endif; ?>
                </td>
                <td>
                    <button class="layui-btn layui-btn-xs layui-btn-danger" onclick="removeSub(<?= $v['id'] ?>)">移除频道
                    </button>
                </td>
            </tr>
        <?php endforeach; ?>
        </tbody>
    </table>

</div>

<pre>
<?php //print_r($hasSubType); ?>
<?php //print_r($select); ?>
<?php //print_r($subType); ?>
</pre>


<script>

    // 添加话题
    $("#add-sub-type").click(function () {
        var data = <?=json_encode($subType)?>;

        var html = "";
        html += '<div style="margin: 10px;" id="add-div">';
        html += '<button class="layui-btn layui-btn-xs" onclick="addSubType()" >加入频道</button>';
        html += '<table class="layui-table">';
        html += '<thead>';
        html += '<tr>';
        html += '<th>选择</th>';
        html += '<th>ID</th>';
        html += '<th>缩略图</th>';
        html += '<th>话题名称</th>';
        html += '<th>话题分类</th>';
        html += '<th>新建时间</th>';
        html += '<th>上线状态</th>';
        html += '</tr>';
        html += '</thead>';
        html += '<tbody>';

        $.each(data, function (i, item) {
            var online = '<span class="layui-bg-orange">下线</span>';
            if (item.online == 2) {
                online = '<span class="layui-bg-green">上线</span>';
            }
            html += '<tr>';
            html += '<td><input type="checkbox" name="" title="发呆" value="' + item.id + '"> </td>';
            html += '<td>' + item.id + '</td>';
            html += '<td><img src="' + item.sub_pic + '" alt="" style="height: 40px;"></td>';
            html += '<td>' + item.sub_title + '</td>';
            html += '<td>' + item.is_other_name + '</td>';
            html += '<td>' + item.add_times + '</td>';
            html += '<td>' + online + '</td>';
            html += '</tr>';
        });

        html += '</tbody>';
        html += '</table>';
        html += '</div>';


        layer.open({
            title: "新增分类",
            type: 1,
            area: ['1200px', '800px'],
            content: html
        });
    });

    function addSubType() {
        // 获取所有选中框
        var checked = [];
        $('input:checkbox:checked').each(function () {
            checked.push($(this).val());
        });
        if (checked.length == 0) {
            layer.msg("请选择话题");
            return;
        }

        var id = <?=$row['id']?>;

        $.ajax({
            type: "post",
            data: {id: id, typesub: checked},
            dataType: "json",
            url: "<?=base_url("word/television/add_typesub")?>",
            success: function (res) {
                if (res.code == 0) {
                    layer.msg(res.msg, {time: 1000}, function () {
                        window.location.reload()
                    })
                } else {
                    layer.msg(res.msg, {time: 2000})
                }
            }
        })

    }

    // 移除频道下的话题
    function removeSub(id) {
        layer.confirm("是否移除？", function (index) {
            $.ajax({
                type: "post",
                data: {id: id},
                dataType: "json",
                url: "<?=base_url("word/television/remove_sub")?>",
                success: function (res) {
                    if (res.code == 0) {
                        layer.msg(res.msg, {time: 1000}, function () {
                            window.location.reload()
                        })
                    } else {
                        layer.msg(res.msg, {time: 2000})
                    }
                }
            })
        });
    }

    // 编辑基本信息
    $("#edit").click(function () {
        var test_name = $('.test_name').val();
        var test_sort = $('.test_sort').val();
        var test_biaoqian = $('.test_biaoqian option:selected').val();
        var id = $('.id').val();
        var data = {
            test_name: test_name,
            test_sort: test_sort,
            test_biaoqian: test_biaoqian,
            id: id,
        };
        $.ajax({
            type: "post",
            data: data,
            dataType: "json",
            url: "<?=base_url("word/television/save_button")?>",
            success: function (res) {
                if (res.code == 0) {
                    layer.msg(res.msg, {time: 1000}, function () {
                        window.location.reload()
                    })
                } else {
                    layer.msg(res.msg, {time: 2000})
                }
            }
        })
    })
</script>